<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<c:forEach items="${imgList }" var="img">
    <div class="box panel-img" id="${img.id }_panel">
        <a href="<c:url value='/imageShow?method=130&imgId=${img.id}'/>" class="swipebox"> <img
                src1="<c:url value='/imageShow?method=130&imgId=${img.id}'/>" title1="${img.title }" w="${img.width }"
                h="${img.height }" />
        </a>


        <div>
            <span class="label label-danger tag">${img.tag }</span>
            <span class="label label-info tag">${img.width } x ${img.height }</span>
        </div>
        <div>
            <button type="button" class="btn btn-info btn-xs" method="11" onclick="">
                移动
            </button>
            <button type="button" class="btn btn-info btn-xs" onclick="deleteImg('${img.id}')">
                删除
            </button>
            <button type="button" class="btn btn-info btn-xs" method="11">
                旋转
            </button>
        </div>

    </div>
</c:forEach>


<script type="text/javascript">
	url = "<c:url value='image' />";
	$(function() {
		$(".swipebox").swipebox();
		
		var $container = $('#masonry');
		$container.imagesLoaded(function() {
			$container.masonry({
				itemSelector : '.box',
				gutter : 10,
				isAnimated : true
			});
			$("img[src1]").each(function() {
				var realSrc = $(this).attr("src1");
				$(this).attr("src", realSrc);

				var realTitle = $(this).attr("title1");
				$(this).attr("title", realTitle);
			});
		});
		$("img[src1]").each(function() {
			var realW = $(this).attr("w");
			var sjW = 236;
			var bl = realW / sjW;

			var realH = $(this).attr("h");
			var sjH = parseInt(realH / bl);
			sjH = sjH > 2000 ? 2000 : sjH;
			$(this).height(sjH);
			$(this).width(sjW);

		});
	});

	function deleteImg(imgId) {
		$("#" + imgId + "_panel").mLoading("show");
		$.ajax({
			type : "POST",
			url : url,
			data : "method=121&imgId=" + imgId,
			success : function(msg) {
				$("#" + imgId + "_panel").remove();

				var $container = $('#masonry');
				$container.masonry({
					itemSelector : '.box',
					gutter : 10,
					isAnimated : true
				});
			},
			error : function() {
				showResult("出错啦！", false);
			}
		});
	}
</script>